<!-- 投诉管理 -->
<template>
	<main-content>
		<uni-table border stripe emptyText="暂无更多数据">
			<uni-tr>
				<uni-th v-for="item in tableConfig" :key="item.dataIndex">{{item.title}}</uni-th>
			</uni-tr>
			<template v-if="listData.length > 0">
				<uni-tr v-for="item in listData" :key="item.id" al>
					<uni-td v-for="itemConfig in tableConfig" :key="itemConfig.dataIndex">
						<view class="w-100" style="word-break:break-all;word-wrap:break-word;">
							{{
							itemConfig?.customRender ? itemConfig.customRender({item,text:item[itemConfig.dataIndex]}) : item[itemConfig.dataIndex]
						}}
						</view>
					</uni-td>
				</uni-tr>
			</template>
		</uni-table>
	</main-content>
</template>
<script setup name='index'>
	import {
		reactive,
		ref,
		getCurrentInstance,
		onMounted,
		computed,
		watch
	} from 'vue'
	import {
		onLoad,
		onShow,
		onReady
	} from '@dcloudio/uni-app'
	import {
		useCommonStore
	} from '@/stores/common.js'
	import {
		useUserStore
	} from '@/stores/user.js'
	import {
		ZZB_PAY_TYPE,
		ZZB_PAY_WAY
	} from '@/common/dict.js'
	import {
		debounce,
		selectDictLabel,
		parseTime,
		formatToMoney
	} from '@/common/common.js'
	import {
		orderApi
	} from '@/pages-menus/common/api/order/index.js'
	const commonStore = useCommonStore()
	const {
		proxy
	} = getCurrentInstance()

	const props = defineProps({
		// 父组件传过来的值
		rowData: {
			type: Object,
			default: () => {},
		},
		type: {
			type: String,
			default: 'refund',
		},
	})

	const maiColor = computed(() => {
		return proxy.$System.maiColor.value
	})

	const tableConfig = [{
			title: '交易订单号',
			dataIndex: 'id',
		},
		{
			title: '交易金额',
			dataIndex: 'tradeAmt',
			customRender: (column) => formatToMoney(column.text / 100),
		},
		{
			title: '退款金额',
			dataIndex: 'refundAmt',
			customRender: (column) => formatToMoney(column.text / 100),
		},
		{
			title: '交易时间',
			dataIndex: 'fTime',
			customRender: (column) => parseTime(column.text),
		},
		{
			title: '交易类型',
			dataIndex: 'payType',
			customRender: ({
				text
			}) => selectDictLabel(ZZB_PAY_TYPE, text),
		},
		{
			title: '支付方式',
			dataIndex: 'payWay',
			customRender: ({
				text
			}) => selectDictLabel(ZZB_PAY_WAY, text),
		},
		{
			title: '门店名称',
			dataIndex: 'storeAbbrName',
		},
	]

	const initForm = {
		id: undefined, //订单号
		orderIds: '-1', //订单号
		storeId: undefined, //门店编号
		storeStaffId: undefined, //门店店员编号
		channelId: undefined, //支付通道
		payType: undefined, //交易类型
		pageNo: 1,
		pageSize: 10,
	}
	const queryForm = ref({
		...initForm
	})

	const total = ref(0)
	const listData = ref([])
	// 获取数据列表
	const getList = async () => {
		// 统一显示加载框
		uni.showLoading({
			title: '加载中...',
			mask: true
		})
		let res = await orderApi.page(queryForm.value)

		if (res.code != 200) return
		total.value = res.total
		listData.value = res.data
		// 隐藏加载框
		uni.hideLoading()
	}

	watch(
		() => props.rowData,
		(newVal) => {
			if (props.rowData.orderIds) {
				queryForm.value.orderIds = newVal.orderIds
				getList()
			}
		}, {
			immediate: true
		},
	)

	onLoad(async (options) => {})
	onReady(() => {
		// paging.value.reload()
	})
</script>
<style lang='scss' scoped>
	.operate-box {
		position: fixed;
		z-index: 99;
		bottom: 50rpx;
	}

	:deep(.zp-paging-container) {
		background-color: #F6F7F9;
	}

	:deep(.u-card .u-card__head) {
		padding: 15px 15px 0 15px !important;
	}

	:deep(.u-card .u-card__foot) {
		/* padding: 0 15px 15px 15px !important; */
	}
</style>